<template>
	<view class="login-wrap">
		
		<u-icon class="fanhui" name="arrow-left" color="#333333" size="35" @click="goindex"></u-icon>
		<view class="login">
			<text>欢迎登录潮盒部落</text>
		</view>
		<!-- #ifndef MP-WEIXIN -->
		    <view class="login-info">
		    	<view class="info">
		    		<view class="img"><image :src="baseUrl + '/static/user/shouji.png'" mode=""></image></view>
					<u-input v-model="mobile" :type="type" height="64" placeholder="请输入手机" />
		    	</view>
		    	<view class="info">
		    		<view class="img"><image :src=" baseUrl + '/static/user/suo.png'" mode=""></image></view>
		    		<u-input v-model="password" type="password" :clearable="false"  height="64" placeholder="请输入密码" />
		    	</view>
		    </view>
		    <view class="login-sub" @tap="subLogin">登陆</view>
			<view class="txt">
				<view class="left" @tap="goForget">忘记密码</view>
				<view class="right" @tap="goRegister">注册</view>
			</view>
			<view class="txt flexs"  @tap="qitalogin">
				其它登录方式
			</view>
		<!-- #endif -->
	</view>
</template>

<script>
export default {
	data() {
		return {
			border: true,
			type: 'number',
			mobile: '',
			password: '',
			baseUrl : this.$configs.urls,
			code:''
		};
	},
	onLoad(option) {
	
	},
	methods: {
		qitalogin(){
			uni.navigateTo({
				url: '/userPage/user/login/phonelogin'
			});
		},
		goRegister() {
			uni.navigateTo({
				url: '/pages/user/register'
			});
		},
		goindex(){
			uni.switchTab({
				url: '/pages/index/redouble'
			});
		},
		subLogin() {
			let data = {
				username: this.mobile,
				password: this.password
			};
			this.otherLogin(data)
			
			
			// // #ifdef H5
			// 	let ua = navigator.userAgent.toLowerCase();
			// 	if (ua.match(/MicroMessenger/i) == "micromessenger") {
			// 		//微信浏览器
			// 		this.h5Login(data);
			// 	} else {
			// 		this.otherLogin(data)
			// 	}
			// // #endif
			
		},
		otherLogin(data){
			this.$Request.post(this.$api.user.doLogin, data).then(res => {
				uni.setStorageSync('USERINFO', res.data.access_token);
				uni.setStorageSync('id', res.data.userId);
				uni.showToast({
					title:res.msg
				})
				setTimeout(()=>{
					uni.switchTab({
						url: '/pages/index/redouble'
					});
				},800)
				 clearTimeout();
			});
		},
		h5Login(data){
			this.$Request.post(this.$api.user.weixinLogin, data).then(res => {
				
				uni.setStorageSync('USERINFO', res.data.access_token);
				uni.setStorageSync('id', res.data.userId);
				window.location.href = res.data.gc
			});
		},
		goForget() {
			uni.navigateTo({
				url: '/userPage/user/login/forget'
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.login-wrap {
	// min-height: 100vh;
	.login {
		margin-top: 241rpx;
		padding-left: 80rpx;
		margin-bottom: 40rpx;
		text{
			color: #333333;
			font-size: 46rpx;
		}
		image {
			width: 100%;
			height: 100%;
		}
	}
	.login-info {
		width: 588rpx;
		margin: 0 auto;
		.info {
			width: 100%;
			height: 88rpx;
			border: 1rpx solid #bcbebe;
			border-radius: 88rpx;
			// padding: 12rpx 25rpx;
			display: flex;
			align-items: center;
			padding-left: 20rpx;
			margin-top: 48rpx;
			padding-right: 20rpx;
			.img {
				width: 58rpx;
				height: 58rpx;
				margin-right: 10rpx;
				image {
					width: 100%;
					height: 100%;
				}
			}
		}
	}
	.login-sub {
		background-image: linear-gradient(#FCB996, #F46971);
		color: #ffffff;
		text-align: center;
		font-size: 35rpx;
		line-height: 88rpx;
		width: 588rpx;
		border-radius: 88rpx;
		margin: 0 auto;
		margin-top: 75rpx;
	}
	.txt {
		padding-top: 23rpx;
		font-size: 28rpx;
		line-height: 40rpx;
		width: 588rpx;
		margin: 0 auto;
		display: flex;
		color: #333333;
		.left {
			flex: 1;
			text-align: left;
		}
		.right {
			flex: 1;
			text-align: right;
		}
	}
}
button{
	background: linear-gradient(180deg, #ff6000 0%, #feaa56 100%);
	margin-top: 200upx;
	border-radius: 15upx!important;
}
button::after{
	border: none;
	background: none;
	
}
.btn_img{
	width: 90upx;
	height: 90upx;
}
.fanhui{
	position: fixed;
	top: 70upx;
	left: 30upx;
}
.titles{
	font-size: 38upx;
	padding: 180upx 0 20upx 20upx;
	font-weight: bold;
	color: #333333;
}
.tit_con{
	font-size: 32upx;
	color: #666666;
	padding: 0 0 50upx 20upx;
}
</style>
